<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Title</title>
  </head>
  
  <body>
    <div id="app">
      <div v-if="type === 'A'">TYPE A</div>
      <div v-else-if="type === 'B'">TYPE B</div>
      <div v-else-if="type === 'C'">TYPE C</div>
      <div v-else-if="type === 'D'">TYPE D</div>
      <div v-else>TYPE E</div>
    </div>
  </body>
  
  <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
  
  <script>
    Vue.createApp({
      data() {
        return {
          // 试着修改以下属性值，看看HTML中的变化
          type: 'B',
        };
      },
    }).mount('#app');
  </script>
</html>